From f1ed2b18f90b89caf47f678204d0179c640aa5e6 Mon Sep 17 00:00:00 2001 From: Factiven Date: Thu, 20 Apr 2023 14:28:45 +0700 Subject: Improve Performance 1 --- pages/anime/watch/[...info].js | 192 +++++++++++++++++++++++++---------------- 1 file changed, 120 insertions(+), 72 deletions(-) (limited to 'pages/anime/watch/[...info].js') diff --git a/pages/anime/watch/[...info].js b/pages/anime/watch/[...info].js index c70f290..3c29888 100644 --- a/pages/anime/watch/[...info].js +++ b/pages/anime/watch/[...info].js @@ -23,7 +23,7 @@ const VideoPlayer = dynamic(() => import("../../../components/videoPlayer", { ssr: false }) ); -export default function Info({ sessions, id, aniId }) { +export default function Info({ sessions, id, aniId, provider }) { const [epiData, setEpiData] = useState(null); const [data, setAniData] = useState(null); const [fallback, setEpiFallback] = useState(null); @@ -31,6 +31,7 @@ export default function Info({ sessions, id, aniId }) { const [statusWatch, setStatusWatch] = useState("CURRENT"); const [playingEpisode, setPlayingEpisode] = useState(null); const [loading, setLoading] = useState(false); + const [playingTitle, setPlayingTitle] = useState(null); // console.log(epiData); @@ -68,22 +69,40 @@ export default function Info({ sessions, id, aniId }) { let epiFallback = null; try { - const res = await fetch( - `https://api.moopa.my.id/meta/anilist/watch/${id}` - ); - const epiData = await res.json(); - setEpiData(epiData); + if (provider) { + const res = await fetch( + `https://api.consumet.org/meta/anilist/watch/${id}?provider=9anime` + ); + const epiData = await res.json(); + setEpiData(epiData); + } else { + const res = await fetch( + `https://api.moopa.my.id/meta/anilist/watch/${id}` + ); + const epiData = await res.json(); + setEpiData(epiData); + } } catch (error) { setTimeout(() => { window.location.reload(); }, 3000); } - const res2 = await fetch( - `https://api.moopa.my.id/meta/anilist/info/${aniId}` - ); - const aniData = await res2.json(); - setAniData(aniData); + let aniData = null; + + if (provider) { + const res = await fetch( + `https://api.consumet.org/meta/anilist/info/${aniId}?provider=9anime` + ); + aniData = await res.json(); + setAniData(aniData); + } else { + const res2 = await fetch( + `https://api.moopa.my.id/meta/anilist/info/${aniId}` + ); + aniData = await res2.json(); + setAniData(aniData); + } if (aniData.episodes.length === 0) { const res = await fetch( @@ -118,6 +137,13 @@ export default function Info({ sessions, id, aniId }) { setPlayingEpisode(playingEpisode); + const title = aniData.episodes + .filter((item) => item.id == id) + .find((item) => item.title !== null); + setPlayingTitle( + title?.title || aniData.title?.romaji || aniData.title?.english + ); + const res4 = await fetch( `https://api.aniskip.com/v2/skip-times/${aniData.malId}/${parseInt( playingEpisode @@ -256,18 +282,12 @@ export default function Info({ sessions, id, aniId }) { console.log(formData); }; - const playingTitle = data?.episodes - .filter((item) => item.id == id) - .map((item) => item.title); - - // console.log(skip); + // console.log(playingTitle.title); return ( <> - - {fallback ? data.title.romaji || data.title.english : playingTitle} - + {playingTitle} {/* */} @@ -373,7 +393,7 @@ export default function Info({ sessions, id, aniId }) { /> ) : ( -
+
)}
{data ? ( @@ -387,7 +407,9 @@ export default function Info({ sessions, id, aniId }) { href={`/anime/${data.id}`} className="inline hover:underline" > - {item.title} + {item.title || + data.title.romaji || + data.title.english}

@@ -530,60 +552,84 @@ export default function Info({ sessions, id, aniId }) {
{data ? ( data.episodes.length > 0 ? ( - data.episodes.map((item) => { - return ( - -
- image item.title && item.description + ) ? ( + data.episodes.map((item) => { + return ( + +
+ image + + Episode {item.number} + + {item.id == id && ( +
+ + + +
+ )} +
+
- - Episode {item.number} - - {item.id == id && ( -
- - - -
- )} -
-
+

+ {item.title} +

+

+ {item.description} +

+
+ + ); + }) + ) : ( + data.episodes.map((item) => { + return ( + -

- {item.title} -

-

- {item.description} -

-
- - ); - }) + Episode {item.number} + + ); + }) + ) ) : ( fallback && fallback.map((item) => { @@ -633,12 +679,14 @@ export async function getServerSideProps(context) { const id = info[0]; const aniId = info[1]; + const provider = info[2] || null; return { props: { sessions: session, id, aniId, + provider, }, }; } -- cgit v1.2.3